<template>
	<view>
		<span style="z-index: 1000;">
			<u-navbar :safeAreaInsetTop="true" :title='title' bgColor="#0275a1" height='50'
				:titleStyle="{color:'#fff',fontWeight:'bold',fontSize:'17px'}">
				<view class="u-nav-slot" slot="left" style="display: flex;">
					<div style="padding-right: 5px">
						<u-icon name="arrow-left" size="22" color='#fff' @click="goBack"></u-icon>
					</div>
					<div style="padding-left: 5px">
						<u-icon name="home" size="22" color='#fff' @click="goHome" style="margin-left: 10px;"></u-icon>
					</div>
				</view>
			</u-navbar>
			<div :style="{height: sysHeight + 'px'}"></div>
		</span>
	</view>
</template>

<script>
	export default {
		props: ['title'],
		data() {
			return {
				osName: null,
				sysHeight: 50
			}
		},
		created() {
			const systemInfo = uni.getSystemInfoSync();
			this.osName = systemInfo.osName;
			this.sysHeight = this.sysHeight + systemInfo.safeArea.top;
		},
		methods: {
			goBack() {
				uni.navigateBack()
			},
			goHome() {
				uni.reLaunch({
					url: '/pages/index'
				})
			}
		}
	}
</script>